<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="UTF-8">
    <title>权限配置</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="/static/super_cmdb/css/font.css">
    <link rel="stylesheet" href="/static/super_cmdb/css/xadmin.css">

  </head>
  
  <body>
   <div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a href="">演示</a>
        <a>
          <cite>导航元素</cite></a>
      </span>
      <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:33px">ဂ</i></a>
    </div>
    <div class="x-body">
        <form class="layui-form">

            <div class="layui-form-item">
              <label for="user_id" class="layui-form-label">
                  <span class="x-red">*</span>用户
              </label>
              <div class="layui-input-inline">
                  <select id="user_id" name="user_id" lay-verify="nikename">
                        {% for user_info in user_list %}
                            <option value="{{ user_info.id }}">{{ user_info.name }}</option>
                        {% endfor %}
                  </select>
              </div>
            </div>

            <div class="layui-form-item">
              <label for="project_id" class="layui-form-label">
                  <span class="x-red">*</span>配置项目
              </label>
              <div class="layui-input-inline">
                  <select id="project_id" name="project_id">
                        {% for project_info in project_list %}
                            <option value="{{ project_info.id }}">{{ project_info.name }}</option>
                        {% endfor %}
                  </select>
              </div>
            </div>

          <div class="layui-form-item" >
              <label for="L_repass" class="layui-form-label">
              </label>
              <button id="my_edit" class="layui-btn" lay-filter="setting" lay-submit="">
                  配置
              </button>
              <button id="my_edit" class="layui-btn" lay-filter="del" lay-submit="">
                  删除
              </button>
          </div>
      </form>

    <table class="layui-table" id="on_color">
        <thead>
          <tr>
            <th>ID</th>
            <th>用户名</th>
            <th>用户类型</th>
            <th>用户拥有的项目</th>
          </tr>
        </thead>
        <tbody>
            {% for user in user_list %}
              <tr>
                <td>{{ user.id }}</td>
                <td>{{ user.name }}</td>
                <td>{{ user.usertype }}</td>
                <td>
                    {% for project_info in user.project.all %}
                            【{{ project_info }}】
                    {% endfor %}
                </td>
              </tr>
            {% endfor %}
        </tbody>
      </table>

    </div>
    <script type="text/javascript" src="/static/super_cmdb/js/jquery.min.js"></script>
    <script type="text/javascript" src="/static/super_cmdb/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="/static/super_cmdb/js/xadmin.js"></script>
    <script src="/static/super_cmdb/js/jquery.cookie.js"></script>
    <script src="/static/super_cmdb/js/bootstrap.min.js"></script>
    <script>

        $(function () {
            $.ajaxSetup({
                beforeSend:function (xhr,settings) {
                    xhr.setRequestHeader("X-CSRFtoken",$.cookie("csrftoken"));
                }
            })
        });

      layui.use(['form','layer'], function(){
          $ = layui.jquery;
        var form = layui.form
        ,layer = layui.layer;

        //监听提交
        form.on('submit(setting)', function(data){
          //发异步，把数据提交给php
            $.ajax({
                    url: "/super_cmdb/permission_set/",
                    type: "POST",
                    data: {
                        "status": "setting",
                        "user_id":$("#user_id").val(),
                        "project_id":$("#project_id").val()
                    },
                    success: function (data) {
                        console.log(data);
                    }
                });

          layer.alert("配置成功", {icon: 6},function () {
              window.location.reload("/super_cmdb/permission_set/")
          });
          return false;
        });

        //监听提交
        form.on('submit(del)', function(data){
          //发异步，把数据提交给php
            $.ajax({
                    url: "/super_cmdb/permission_set/",
                    type: "POST",
                    data: {
                        "status": "del",
                        "user_id":$("#user_id").val(),
                        "project_id":$("#project_id").val()
                    },
                    success: function (data) {
                        console.log(data);
                    }
                });

          layer.alert("删除成功", {icon: 6},function () {
              location.reload();
          });
          return false;
        });


      });

    //选中着色,包含这个标签下的所有子标签
    var trs = document.getElementById('on_color').getElementsByTagName('tr');
    window.onload = function(){
        for( var i=0; i<trs.length; i++ ){
            trs[i].onmousedown = function(){
                tronmousedown(this);
            }
        }
    };
    function tronmousedown(obj){
        for( var o=0; o<trs.length; o++ ){
            if( trs[o] == obj ){
                trs[o].style.backgroundColor = 'rgb(174, 212, 234)';
            }
            else{
                trs[o].style.backgroundColor = '';
            }
        }
    }
  </script>
  </body>

</html>